import React, {memo, useContext} from 'react';
import { useUserToken } from './hooks/index'

const Home = memo(() => {
  const { user, token } = useUserToken();
  return (
      <div>
        <h1>Home Page</h1>
        <h2>{user.name}</h2>
        <h2>{token}</h2>
      </div>
  )
})

const About = memo(() => {
  const { user, token } = useUserToken();
  return (
      <div>
        <h1>About Page</h1>
        <h2>{user.name}</h2>
        <h2>{token}</h2>
      </div>
  )
})

const App = memo(() => {
  const { user, token } = useUserToken();
  return (
      <div>
        <h1>App</h1>
        <h2>{user.name}</h2>
        <h2>{token}</h2>
        <Home/>
        <About/>
      </div>
  );
});

export default App;